<template>
	<div class="wrap">
		<el-row>
			<el-space :size="30">
				<el-form-item label="寝室号：">
					<el-input v-model.number="condition.dorNumber" />
				</el-form-item>
				<el-form-item label="学生姓名：">
					<el-input v-model.trim="condition.stuName" />
				</el-form-item>
				<el-form-item label="学生学号：">
					<el-input v-model.number="condition.stuId" />
				</el-form-item>
				<el-form-item label="在校情况">
					<el-select v-model="condition.status" placeholder="请选择">
						<el-option label="在校" value="在校" />
						<el-option label="离校" value="离校" />
						<el-option label="请选择" value="" />
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-button class="btn" @click="handleSearch"
						><el-icon><Search /></el-icon> 搜索</el-button
					>
				</el-form-item>
				<el-form-item>
					<el-button class="btn" @click="resetSearch"> 重置</el-button>
				</el-form-item>
			</el-space>
		</el-row>

		<HolidayWherelTable :tableData="hoildayInfo" @change="handleChange" :total="total" />
	</div>
</template>

<script setup>
import HolidayWherelTable from '@/components/domi_admin/HolidayWherelTable.vue'
import { reactive, ref } from 'vue'
import { debounce } from '@/utils/tools'
import {
	getRoomHolInfo,
	getHolOneStu,
	getHolBuildOn,
	getHolBuildLeave,
	getAllStuHolInfo,
} from '@/utils/axios/domiRequests'
import useRegStore from '@/stores/useReg'

import { useUserStore } from '@/stores/userStore'
import { ElMessage } from 'element-plus'

const { userInfo } = useUserStore()
const {  isInteger } = useRegStore()
// 搜索条件
const condition = reactive({
	dorNumber: '',
	stuId: '',
	stuName: '',
	status: '',
})

// 总数
const total = ref(0)

// 查询结果
const hoildayInfo = ref([])

// 自定义事件
const handleChange = ({ data, tota }) => {
	hoildayInfo.value = data
	total.value = tota ? tota : 0
}

// 重置搜索
const resetSearch = async () => {
	let { data } = await getAllStuHolInfo({ currentPage: 1, buildId:parseInt( userInfo.buildId )})
	hoildayInfo.value = data
	Object.assign(condition, { dorNumber: '', stuId: '', stuName: '', status: '' })
}

/* 
    搜索优先级 由高到低：
    1.  宿管查看某个学生的假期情况
    2. 按照房间号搜索
    3. 在校、离校查询
*/
// 处理搜索申请
const handleSearch = debounce(async () => {

	let { dorNumber, stuId, stuName, status } = condition
	let data = []
	if (!stuId) stuId = 0
	// 4.管理员查看某个学生的假期情况
	if (stuId || stuName) ({ data } = await getHolOneStu({ stuId, stuName }))
	else if (dorNumber) {
		if (!isInteger(dorNumber)) return ElMessage.warning({ message: '请输入整数' })
		;({ data } = await getRoomHolInfo({ buildId: userInfo.buildId, dorNumber }))
	} else
		status == '离校'	
			? ({ data } = await getHolBuildLeave({ currentPage: 1, pageSize: 10 }))
			: ({ data } = await getHolBuildOn({ currentPage: 1, pageSize: 10 }))


	Array.isArray(data) ? (hoildayInfo.value = data) : (hoildayInfo.value = [data])
	total.value = data?.length ?? 1
	hoildayInfo.value = !hoildayInfo.value[0] ? (hoildayInfo.value = []) : hoildayInfo.value
})
</script>

<style scoped lang="scss">
.el-input {
	width: 100px;
}

.el-select {
	width: 100px;
}
.btn {
	background: rgb(0, 202, 237);
	color: #ffff;
}
</style>
